本系列文章所討論的 JavaScript 資安與逆向工程技術，旨在分享知識、探討防禦之道，並促進技術交流。
所有內容僅供學術研究與學習，請勿用於任何非法或不道德的行為。
讀者應對自己的行為負完全責任。尊重法律與道德規範是所有技術人員應共同遵守的準則。

本文同步發佈：https://nicklabs.cc/devtools-debugger-bypass

在進行 JavaScript 逆向工程時，開啟 DevTools 進行程式觀察是必經的步驟。

但許多前端防護或反爬蟲系統會利用 debugger 來干擾分析，讓你在程式跑到關鍵位置時不斷中斷。

要能順利逆向必須先理解 debugger 的觸發方式再掌握對應的方法。

常見的 debugger 觸發方式

直接使用關鍵字 debugger

debugger;

定時器觸發 debugger

setInterval(function() {
    debugger;
}, 1000);

死迴圈觸發 debugger

(function () {
    while (true) {
        debugger;
    }
})();

動態產生 debugger

(function() {
    eval("debugger");
})();

函數包裝或變形

Function("debugger")();

常見的對應方式

Sources中Overrides JS檔

可以利用 Overrides 功能直接修改本地檔案。

但遇到程式碼混淆嚴重的就會難以找到確切位置。

Sources中停用斷點

DevTools工具中的Sources 可以開啟關閉斷點的功能，但這時會造成調適時也無法下斷點。

複寫函式

用定時器觸發的可以將定時器函式複寫

setInterval = function() {};

用eval觸發的也可以將eval複寫

window.eval = function() {};

最好的方式是從建構函式直接處理

Function.prototype.__constructor = Function.prototype.constructor;
Function.prototype.constructor = function(){
	if(arguments && typeof arguments[0] === 'string'){
		if(arguments[0] === 'debugger'){
			return;
		}
	}
	Function.prototype.__constructor.apply(this, arguments);
}

debugger 是逆向工程中最常見的干擾技巧攻防兩端都很常用。

理解它的觸發方式並熟悉相對應的解法，才能確保逆向流程不中斷順利觀察程式的行為。

但僅只有這個防護是遠遠不夠的還需要多的手段進行保護。